/*
 * @Description: 
 * @Author: 邢
 * @Date: 2021-04-21 00:23:02
 * @LastEditTime: 2021-04-21 16:06:05
 * @LastEditors: 邢
 */
import React from 'react'
//less
import styles from "./index.less"

import { IRouteComponentProps,NavLink } from "umi"
import { Layout,Avatar } from "antd"
import { UserOutlined } from '@ant-design/icons';

const { Header,Footer,Content } = Layout;

function layout(props:IRouteComponentProps) {
    return (
        <>
            <Header className={styles.header}>
                <div className={styles.logo}>
                    <img src="https://wipi.oss-cn-shanghai.aliyuncs.com/2021-02-20/wipi-favicon.png" alt=""/>
                    <span>管理后台</span>
                </div>
                <ul className={styles.nav}>
                    <li>
                        <NavLink to="/works">工作台</NavLink>
                    </li>
                    <li>
                        <NavLink to="/article">文章管理</NavLink>
                    </li>
                    <li>
                        <NavLink to="/page">页面管理</NavLink>
                    </li>
                    <li>
                        <NavLink to="/knowledge">知识笔记</NavLink>
                    </li>
                    <li className={styles.avatar}><Avatar size="small" icon={<UserOutlined />} /><span className={styles.sp}>JSonp</span></li>
                </ul>
            </Header>
            <Content className={styles.content}>
                {props.children}
            </Content>
            <Footer className={styles.footer}>
                <a href="https://github.com/fantasticit/wipi"><img src="" alt=""/></a>
                <p>Copyright  2021 Designed by <a href="https://github.com/fantasticit/wipi">Fantasticit.</a></p>
            </Footer>
        </>
    )
}
export default layout
